<template>
	<view class="miou-tab-list">
		<view class="grid col-4 padding-sm">
			<view class="padding-xs" 
				v-for="(item, index) in navList" 
				:key="index"
				@click="navTap(item)"
			>
				<view class="padding-tb-sm radius text-center shadow-blur radius tab-item">
					<image class="icon" :src="'/static/img/' + item.icon" />
					<view class="margin-top-xs text-Abc text-bold">{{item.text}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>

export default {
	data() {
		return {
			navList: [
				{
					id: 1,
					text: '找剧本',
					icon: 'ic_index_findscript.png',
					path: 'findScen'
				},
				{
					id: 2,
					text: '剧本排行',
					icon: 'ic_index_scriptrank.png',
					path: 'scenRank'
				},
				{
					id: 3,
					text: '展会信息',
					icon: 'ic_index_exponews.png',
					path: 'exhibition'
				},
				{
					id: 4,
					text: '发行信息',
					icon: 'ic_index_issuenews.png',
					path: 'studio'
				}
			],
			
		};
	},

	methods: {
		navTap(nav) {
			if(!nav.path) return
			this.$jumpPages(nav.path)
		},
	}
};
</script>

<style lang="scss" scoped>
.miou-tab-list{
	.tab-item{
		background-color: #F7F9FF;
	}
	.icon{
		display: block;
		width: 38rpx;
		height: 38rpx;
		margin: auto;
	}
}
</style>